﻿<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="hp.com.entity.Users" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%
    String path = request.getContextPath();
    request.setAttribute("path",path);
    if(request.getParameter("pageNo")==null){
        request.setAttribute("pageNo","1");
    }else {
        request.setAttribute("pageNo", request.getParameter("pageNo"));
    }
    int cate=0;
    String cateText="全部";
    if(request.getParameter("category")!=null){
        cate=Integer.parseInt(request.getParameter("category"));
        switch (cate){
            case 1:
                cateText="饮食类";
                break;
            case 2:
                cateText="个护类";
                break;
            case 3:
                cateText="服装类";
                break;
            case 4:
                cateText="居家类";
                break;
            case 5:
                cateText="数码类";
                break;
            case 14:
                cateText="学习类";
                break;
        }
    }
    Users userSession =(Users) request.getSession().getAttribute("userSession");
    String type =(String) request.getAttribute("type");
    if(type.equals("all")){
        request.setAttribute("attr","/AllProducts?pageNo=");
    }else if(type.equals("category")){
        request.setAttribute("attr","/Types?category="+cate+"&&pageNo=");
    }
    request.setAttribute("cateText",cateText);
%>
<html xmlns="http://www.w3.org/1999/xhtml">
<!doctype html>
<html class="no-js" lang="zh-cn">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>商品列表-青鸟优选</title>
        <meta name="description" content="">
        <link rel="icon" href="${path}/jbs/images/ico.ico" type="image/x-icon">
        <meta name="viewport" content="width=device-width, initial-scale=1">

		<link rel="shortcut icon" type="image/x-icon" href="img/favicon.png">
        <!-- Place favicon.ico in the root directory -->

		<!-- CSS here -->
        <link rel="stylesheet" href="${path}/assets/css/bootstrap.min.css">
        <link rel="stylesheet" href="${path}/assets/css/animate.min.css">
        <link rel="stylesheet" href="${path}/assets/css/magnific-popup.css">
        <link rel="stylesheet" href="${path}/assets/css/fontawesome-all.min.css">
        <link rel="stylesheet" href="${path}/assets/css/jquery-ui.css">
        <link rel="stylesheet" href="${path}/assets/css/flaticon.css">
        <link rel="stylesheet" href="${path}/assets/css/aos.css">
        <link rel="stylesheet" href="${path}/assets/css/slick.css">
        <link rel="stylesheet" href="${path}/assets/css/default.css">
        <link rel="stylesheet" href="${path}/assets/css/style.css">
        <link rel="stylesheet" href="${path}/assets/css/responsive.css">
    </head>
    <body>

    <!-- preloader -->
    <div id="preloader">
        <div id="loading-center">
            <div class="loader">
                <img src="${path}/assets/img/logo/ico.png" alt="">
            </div>
        </div>
    </div>
    <!-- preloader-end -->

    <!-- header-area -->
    <header class="header-style-two">
        <!-- header-search-area -->
        <div class="header-search-area">
            <div class="container custom-container">
                <div class="row align-items-center">
                    <div class="col-xl-2 col-lg-3 d-none d-lg-block">
                        <div class="logo">
                            <a href="${path}/Index"><img src="${path}/assets/img/logo/logo.png" alt="Logo"></a>
                        </div>
                    </div>
                    <div class="col-xl-10 col-lg-9">
                        <div class="d-block d-sm-flex align-items-center justify-content-end">
                            <div class="header-search-wrap">
                                <form action="#">
                                    <input type="text" placeholder="搜索商品">
                                    <button><i class="flaticon-loupe-1"></i></button>
                                </form>
                            </div>
                            <div class="header-action">
                                <ul>
                                    <c:choose>
                                        <c:when test="${requestScope.userSession==null}">
                                            <li class="header-user" ><a href="${path}/Login" style="color: var(--color-primary);width: 60px;border-radius: 20px">
                                                登录</a></li>
                                            <%--                                        <li class="header-wishlist">--%>
                                            <%--                                            <a href="#"><i class="flaticon-heart-shape-outline"></i></a>--%>
                                            <%--                                            <span class="item-count">0</span>--%>
                                            <%--                                        </li>--%>
                                            <li class="header-user"><a href="#" style="color: var(--color-primary);width: 60px;border-radius: 20px">
                                                注册</a></li>
                                        </c:when>
                                        <c:otherwise>
                                            <li class="header-user">
                                                <div class="header-cart-wrap">
                                                    <a href="${path}/User"><img src="${requestScope.userSession.pic_link}" alt="" style="width:44px;border-radius: 50px;height: 44px;object-fit: cover"></a>
                                                    <ul class="minicart" style="padding-right: 10px">
                                                        <li class="d-flex align-items-start">
                                                            <div class="cart-img">
                                                                <img src="${requestScope.userSession.pic_link}" alt="" style="width: 90px;height: 90px;border-radius: 90px">
                                                            </div>
                                                            <div class="cart-content" style="margin-top: 15px;padding-right: 15px">
                                                                <h4>${requestScope.userSession.loginname}</h4>
                                                                <div class="cart-price">
                                                                    <span class="new">${requestScope.userSession.userTypeText}</span>
                                                                    <span style="margin: 0">${requestScope.userSession.phone}</span>
                                                                </div>
                                                            </div>
                                                            <div class="del-icon">
                                                                <a onclick="logout()" style="cursor: pointer"><i class="far fa-sign-out-alt"></i></a>
                                                            </div>
                                                        </li>
                                                        <li class="d-flex align-items-start">
                                                            <div class="index-proPicBtns">
                                                                <a href="${path}/User"><button>个人中心</button></a>
                                                                <button>已买到的宝贝</button>
                                                            </div>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </li>
                                            <li class="header-cart-action">
                                                <div class="header-cart-wrap">
                                                    <a href="${path}/Cart"><i class="flaticon-shopping-basket"></i></a>
                                                    <span class="item-count">2</span>
                                                    <ul class="minicart">
                                                        <li class="d-flex align-items-start">
                                                            <div class="cart-img">
                                                                <a href="${path}/Cart"><img src="${path}/assets/img/product/cart_p01.jpg" alt=""></a>
                                                            </div>
                                                            <div class="cart-content">
                                                                <h4><a href="Product.jsp">Organic Farm Fresh Nuts</a></h4>
                                                                <div class="cart-price">
                                                                    <span class="new">$229.9</span>
                                                                    <span><del>$229.9</del></span>
                                                                </div>
                                                            </div>
                                                            <div class="del-icon">
                                                                <a href="#"><i class="far fa-trash-alt"></i></a>
                                                            </div>
                                                        </li>
                                                        <li class="d-flex align-items-start">
                                                            <div class="cart-img">
                                                                <a href="Product.jsp"><img src="${path}/assets/img/product/cart_p02.jpg" alt=""></a>
                                                            </div>
                                                            <div class="cart-content">
                                                                <h4><a href="Product.jsp">Organic Fresh Nuts Vanla Butter</a></h4>
                                                                <div class="cart-price">
                                                                    <span class="new">$229.9</span>
                                                                    <span><del>$229.9</del></span>
                                                                </div>
                                                            </div>
                                                            <div class="del-icon">
                                                                <a href="#"><i class="far fa-trash-alt"></i></a>
                                                            </div>
                                                        </li>
                                                        <li>
                                                            <div class="total-price">
                                                                <span class="f-left">Total:</span>
                                                                <span class="f-right">$239.9</span>
                                                            </div>
                                                        </li>
                                                        <li>
                                                            <div class="checkout-link">
                                                                <a href="Cart.jsp">Shopping Cart</a>
                                                                <a class="black-color" href="checkout.jsp">Checkout</a>
                                                            </div>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </li>
                                        </c:otherwise>
                                    </c:choose>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- header-search-area-end -->
    </header>

    <!-- header-area-end -->

        <!-- main-area -->
        <main>
            <!-- shop-area -->
            <section class="shop--area pt-90 pb-90">
                <div class="container">
                    <div class="row justify-content-center">
                        <div class="col-9">
                            <p style="color: var(--color-primary);font-size: 40px;font-weight: bolder;;text-align: center;margin-bottom: 30px;">${cateText}商品</p>
                            <ul class="menu_r"id="menuUl">
                                <li><a href="${path}/AllProducts?pageNo=1" >全部</a></li>
                                <li><a href="${path}/Types?category=14&pageNo=1" id="m0">学习</a></li>
                                <li ><a href="${path}/Types?category=1&pageNo=1" id="m1">饮食</a></li>
                                <li ><a href="${path}/Types?category=2&pageNo=1"id="m2">个护</a></li>
                                <li ><a href="${path}/Types?category=3&pageNo=1"id="m3">服装</a></li>
                                <li ><a href="${path}/Types?category=4&pageNo=1"id="m4">家居</a></li>
                                <li ><a href="${path}/Types?category=5&pageNo=1"id="m5">数码</a></li>
                            </ul>
                            <c:if test="${pageNo==1||pageNo==null}">
                                <div class="shop-discount-area">
                                    <div class="discount-content shop-discount-content">
                                        <span style="color: var(--color-primary);font-weight: bolder;font-size: 25px">武汉宏鹏</span>
                                        <h4 class="title" style="color: var(--color-primary);font-weight: bolder;font-size: 40px"><a href="shop.jsp">校长福利购</a></h4>
                                        <p style="color: whitesmoke;">层层挑选 真情回馈</p>
                                        <a href="shop.jsp" class="btn rounded-btn">查看详情</a>
                                    </div>
                                </div>
                            </c:if>
                            <div class="shop-products-wrap">
                                <div class="row justify-content-center">
                                    <c:forEach items="${requestScope.page.pageList}" var="i">
                                    <div class="col-xl-3 col-md-4 col-sm-6">
                                        <div class="sp-product-item">
                                            <div class="sp-product-thumb">
                                                <span class="batch">${i.cateLvl2Text}</span>
                                                <a href="${path}/details?id=${i.id}"><img src="${i.picName}" alt=""></a>
                                            </div>
                                            <div class="sp-product-content">
                                                <h6 class="title"><a href="${path}/details?id=${i.id}">${i.easyName}</a></h6>
                                                <span class="product-status">${i.description}</span>
                                                <p>¥${i.sukPrice}</p>
                                            </div>
                                        </div>
                                    </div>
                                    </c:forEach>
                                </div>
                            </div>
                            <div class="pagination-wrap">
                                <ul>
                                    <c:if test="${pageNo!=1&&pageNo!=null}">
                                        <li class="prev"><a href="${path}${attr}1" id="firstPageBtn" >首页</a></li>
                                        <li class="prev"><a href="${path}${attr}${page.pageNo -1 <=1? 1:page.pageNo -1}">上一页</a></li>
                                    </c:if>
                                    <c:forEach  begin="1" end="${page.pageNum}" varStatus="i">
                                        <c:if test="${i.index==page.pageNo}">
                                            <style>
                                                #pageId_${i.index}:hover{
                                                    animation: none !important;
                                                }
                                            </style>
                                        </c:if>
                                        <li><a id="pageId_${i.index}" href="${path}${attr}${i.index}" <c:if test="${i.index==page.pageNo}">style="background-color: #02A4d9;color: white"</c:if> >${i.index}</a></li>
                                    </c:forEach>
                                    <c:if test="${pageNo!=page.pageNum}">
                                        <li class="next"><a href="${path}${attr}${page.pageNo +1 >=page.pageNum?page.pageNum:page.pageNo +1}">下一页</a></li>
                                        <li class="next"><a href="${path}${attr}${page.pageNum}">末页</a></li>
                                    </c:if>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            <!-- shop-area-end -->
        </main>
        <!-- main-area-end -->
    <!-- footer-area -->
    <footer>
        <%--            <div class="footer-area gray-bg pt-80 pb-30">--%>
        <%--                <div class="container">--%>
        <%--                    <div class="row justify-content-between">--%>
        <%--                        <div class="col-xl-3 col-lg-4 col-md-6">--%>
        <%--                            <div class="footer-widget mb-50">--%>
        <%--                                <div class="footer-logo mb-25">--%>
        <%--                                    <a href="${path}/Index"><img src="${path}/assets/img/logo/logo.png" alt=""></a>--%>
        <%--                                </div>--%>
        <%--                                <div class="footer-contact-list">--%>
        <%--                                    <ul>--%>
        <%--                                        <li>--%>
        <%--                                            <div class="icon"><i class="flaticon-place"></i></div>--%>
        <%--                                            <p>PO Box W75 Street West New Queens, TX 16819</p>--%>
        <%--                                        </li>--%>
        <%--                                        <li>--%>
        <%--                                            <div class="icon"><i class="flaticon-telephone-1"></i></div>--%>
        <%--                                            <h5 class="number"><a href="tel:12027993245">+120 279 932 45</a></h5>--%>
        <%--                                        </li>--%>
        <%--                                        <li>--%>
        <%--                                            <div class="icon"><i class="flaticon-mail"></i></div>--%>
        <%--                                            <p><a href="/cdn-cgi/l/email-protection#85f6f0f5f5eaf7f1c5f3e0e2e0ebabe6eae8"><span class="__cf_email__" data-cfemail="4b383e3b3b24393f0b3d2e2c2e2565282426">[email&#160;protected]</span></a></p>--%>
        <%--                                        </li>--%>
        <%--                                        <li>--%>
        <%--                                            <div class="icon"><i class="flaticon-wall-clock"></i></div>--%>
        <%--                                            <p>Week 7 days from 7:00 to 20:00</p>--%>
        <%--                                        </li>--%>
        <%--                                    </ul>--%>
        <%--                                </div>--%>
        <%--                                <div class="footer-social">--%>
        <%--                                    <ul>--%>
        <%--                                        <li><a href="#"><i class="fab fa-facebook-f"></i></a></li>--%>
        <%--                                        <li><a href="#"><i class="fab fa-twitter"></i></a></li>--%>
        <%--                                        <li><a href="#"><i class="fab fa-youtube"></i></a></li>--%>
        <%--                                        <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>--%>
        <%--                                    </ul>--%>
        <%--                                </div>--%>
        <%--                            </div>--%>
        <%--                        </div>--%>
        <%--                        <div class="col-xl-2 col-lg-3 col-md-4 col-sm-6">--%>
        <%--                            <div class="footer-widget mb-50">--%>
        <%--                                <div class="fw-title">--%>
        <%--                                    <h5 class="title">Customer Service</h5>--%>
        <%--                                </div>--%>
        <%--                                <div class="fw-link">--%>
        <%--                                    <ul>--%>
        <%--                                        <li><a href="shop.jsp">Secure Shopping</a></li>--%>
        <%--                                        <li><a href="Cart.jsp">Order Status</a></li>--%>
        <%--                                        <li><a href="shop.jsp">International Shipping</a></li>--%>
        <%--                                        <li><a href="checkout.jsp">Payment Method</a></li>--%>
        <%--                                        <li><a href="blog.html">Our Blog</a></li>--%>
        <%--                                        <li><a href="terms-conditios.html">Orders and Returns</a></li>--%>
        <%--                                        <li><a href="checkout.jsp">Track Your Orders</a></li>--%>
        <%--                                        <li><a href="act.jsp">Footer Links</a></li>--%>
        <%--                                    </ul>--%>
        <%--                                </div>--%>
        <%--                            </div>--%>
        <%--                        </div>--%>
        <%--                        <div class="col-xl-2 col-lg-3 col-md-4 col-sm-6">--%>
        <%--                            <div class="footer-widget mb-50">--%>
        <%--                                <div class="fw-title">--%>
        <%--                                    <h5 class="title">Useful Links</h5>--%>
        <%--                                </div>--%>
        <%--                                <div class="fw-link">--%>
        <%--                                    <ul>--%>
        <%--                                        <li><a href="checkout.jsp">Delivery</a></li>--%>
        <%--                                        <li><a href="terms-conditios.html">Legal Notice</a></li>--%>
        <%--                                        <li><a href="about-us.html">About us</a></li>--%>
        <%--                                        <li><a href="paymentSuccess.jsp">Sitemap</a></li>--%>
        <%--                                        <li><a href="checkout.jsp">Track Your Orders</a></li>--%>
        <%--                                        <li><a href="act.jsp">Footer Links</a></li>--%>
        <%--                                        <li><a href="terms-conditios.html">Orders and Returns</a></li>--%>
        <%--                                        <li><a href="paymentSuccess.jsp">Contact Us</a></li>--%>
        <%--                                    </ul>--%>
        <%--                                </div>--%>
        <%--                            </div>--%>
        <%--                        </div>--%>
        <%--                        <div class="col-xl-4 col-lg-4 col-md-6">--%>
        <%--                            <div class="footer-widget footer-box-widget mb-50">--%>
        <%--                                <div class="f-download-wrap">--%>
        <%--                                    <div class="fw-title">--%>
        <%--                                        <h5 class="title">Download App</h5>--%>
        <%--                                    </div>--%>
        <%--                                    <div class="download-btns">--%>
        <%--                                        <a href="act.jsp"><img src="${path}/assets/img/icon/g_play.png" alt=""></a>--%>
        <%--                                        <a href="act.jsp"><img src="${path}/assets/img/icon/app_store.png" alt=""></a>--%>
        <%--                                    </div>--%>
        <%--                                </div>--%>
        <%--                                <div class="f-newsletter">--%>
        <%--                                    <div class="fw-title">--%>
        <%--                                        <h5 class="title">Newsletter</h5>--%>
        <%--                                    </div>--%>
        <%--                                    <form action="#">--%>
        <%--                                        <input type="email" placeholder="Email Address">--%>
        <%--                                        <button><i class="flaticon-send"></i></button>--%>
        <%--                                    </form>--%>
        <%--                                    <p>Do Not Show Your Mail</p>--%>
        <%--                                </div>--%>
        <%--                            </div>--%>
        <%--                        </div>--%>
        <%--                    </div>--%>
        <%--                </div>--%>
        <%--            </div>--%>
        <div class="copyright-wrap">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6">
                        <div class="copyright-text">
                            <p>Copyright &copy 2006-2020 武汉北启至优文化科技有限公司 版权所有 All Rights Reserved.</p>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="payment-accepted text-center text-md-right">
                            <img src="${path}/assets/img/images/payment_card.png" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- footer-area-end -->





		<!-- JS here -->
        <script src="${path}/assets/js/vendor/jquery-3.6.0.min.js"></script>
        <script src="${path}/assets/js/bootstrap.min.js"></script>
        <script src="${path}/assets/js/isotope.pkgd.min.js"></script>
        <script src="${path}/assets/js/imagesloaded.pkgd.min.js"></script>
        <script src="${path}/assets/js/jquery.magnific-popup.min.js"></script>
        <script src="${path}/assets/js/jquery.countdown.min.js"></script>
        <script src="${path}/assets/js/jquery-ui.min.js"></script>
        <script src="${path}/assets/js/slick.min.js"></script>
        <script src="${path}/assets/js/ajax-form.js"></script>
        <script src="${path}/assets/js/wow.min.js"></script>
        <script src="${path}/assets/js/aos.js"></script>
        <script src="${path}/assets/js/plugins.js"></script>
        <script src="${path}/assets/js/main.js"></script>
    <script >
        var cate =${cate};
        if(cate==1){
            $("#m1").css({"background-color":"var(--color-primary)","color":"white",});
        }else if(cate ==2){
            $("#m2").css({"background-color":"var(--color-primary)","color":"white",});
        }else if(cate ==3){
            $("#m3").css({"background-color":"var(--color-primary)","color":"white",});
        }else if(cate ==4){
            $("#m4").css({"background-color":"var(--color-primary)","color":"white",});
        }else if(cate ==5){
            $("#m5").css({"background-color":"var(--color-primary)","color":"white",});
        }else if(cate==14){
            $("#m0").css({"background-color":"var(--color-primary)","color":"white",});
        }

    </script>

    </body>
</html>
